﻿@page
@model Core.Web.Pages.Menu.I2Model
@{
    ViewData["Title"] = "菜单管理";
}


@section Heads{
    <partial name="_GridStylesPartial.cshtml" />
}

<h1>I2 - Menu</h1>

<div id="apj-list-container" class="apj-flex-item">
    <table id="apj-grid"></table>
    <div id="apj-grid-pager"></div>
</div>


@section Scripts{
    <partial name="_GridScriptsPartial.cshtml" />
    <script type="text/javascript">
    var $tableGrid = $("#apj-grid");
    var $gridContainer = $("#apj-list-container");

    function resizeTableGrid() {
        $tableGrid.jqGrid('setGridWidth', $gridContainer.width() - 2);
        $tableGrid.jqGrid('setGridHeight', $gridContainer.height() - 58);
    }
    $(function () {
        $tableGrid.jqGrid({
            url: '/Menu?handler=List',
            mtype: 'post',
            datatype: "json",
            rowNum: 15,
            rownumWidth: 25,
            rownumbers: true,
            rowList: [15, 25, 30],
            shrinkToFit: false,
            width: $gridContainer.width(),
            height: $gridContainer.height() - 58,
            viewrecords: true,
            pager: "#apj-grid-pager",
            prmNames: {
                page: "pageIndex",
                rows: "pageSize",
                sort: "orderBy",
                order: "orderType"
            },
            recordtext: '总记录 {2} 条',
            //multiselect: true,
            colModel: [
                { label: '编号', name: 'id', hidden: true, key: true, frozen: true },
                { label: '名称', name: 'name', width: 80, align: 'center' },
                { label: '唯一标识', name: 'uniqueId', width: 80, align: 'center' },
                { label: '链接地址', name: 'link', width: 100, align: 'left' },
                { label: '排序', name: 'seq', width: 50, align: 'right' },
                { label: '上级菜单', name: 'parentName', width: 80, align: 'center' },
                { label: '描述', name: 'describe', width: 150, align: 'left' },
                { label: '创建人', name: 'createBy', width: 80, align: 'center' },
                {
                    label: '状态', name: 'isActive', width: 50, align: 'center', frozen: true, formatter: function (value, options, rowObj) {
                        if (value) {
                            return '<span class="apj-griddata-label" style="background:#2db7f5">启用</span>';
                        }
                        else {
                            return '<span class="apj-griddata-label" style="background:#f29100">禁用</span>';
                        }
                    }
                }
            ],
            postData: $.extend(true, {}, URI(window.location.href).search(true)),
            sortname: 'id',
            sortorder: "desc",
            loadBeforeSend: function (jqXHR) {
                jqXHR.setRequestHeader("X-CSRF-TOKEN", apj.getCookie("XSRF-TOKEN"));
            },
            ondblClickRow: function (rowid, iRow, iCol, e) {
                update(rowid);
            }
        });

        $tableGrid.jqGrid("navGrid", "#apj-grid-pager", { edit: false, add: false, del: false, search: false, view: false });
        $tableGrid.jqGrid('bindKeys', {
            "onEnter": function (rowid) {
                update(rowid);
            }
        });
        $tableGrid.jqGrid('setFrozenColumns');
        $(window).resize(function () {
            resizeTableGrid();
        });
    });
    </script>
}